@layout("/common/_container.html"){
<style>
    .homeHeader,.homeNav,.homeStatistics > div{
        display: flex;
    }
    .homeHeader > div,.homeNav > div,.homeNav > div > div,.homeStatistics > div > div{
        flex: 1;
    }
    .homeHeader > div > img{
        width: 1.4em;
        vertical-align: middle;
    }
    .homeBanner .swiper-slide > img , .homeNav > div img{
        width: 100%;
    }
    .homeStatistics{
        text-align: center;
    }
    .homeTitle > h3 > img{
        width: 0.3em;
        height: 1.3em;
        vertical-align: middle;
        margin-right: 0.5em;
    }
    .homeTitle > h3 > span, .homeHeader > div > span{
        vertical-align: middle;
    }
    .homeNav > div:first-of-type{
        margin-right: 0.3em;
    }
    .homeNav > div > div:first-of-type{
        margin-bottom: 0.3em;
    }
    .homeNav > div > div{
        border-radius: 0.2em;
        overflow: hidden;
        box-shadow: 0 1px 2px #888888;
    }
    .homeHeader{
        height: 3em;
        line-height: 2.8em;
        position: fixed;
        background: white;
        width: 100%;
        z-index: 1;
        border-bottom: 1px solid #E5E5E5;
        padding: 0 0.6em;
    }
    .homeBanner{
        padding-top: 3.5em;
    }
    .homeTitle{
        padding-top: 0.5em;
    }
    .homeStatistics > div:first-of-type{
        background: #f5f5f5;
        padding: 0.6em 0;
        font-weight: bold;
        font-size: 1.5em;
        margin-bottom: 0.5em;
    }
    .homeHeader > div > span:last-of-type{
        margin-left: 0.5em;
    }
</style>
<div class="homeBox">
    <div class="homeHeader">
        <div>
            <img src="${ctxPath}/static/weixin-img/mark.png" alt="加载中...">
            <span>徐东店</span>
        </div>
        <div style="flex: 2"></div>
        <div style="text-align: right;color: #03abc9;">
            <span class="glyphicon glyphicon-search"></span>
            <span class="glyphicon glyphicon-plus" style="top: 0;margin-left: 1.5em"></span>
        </div>
    </div>
    <div class="wrap">
        <div class="homeBanner">
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide"><img src="${ctxPath}/static/weixin-img/banner01.jpg" alt="加载中..."></div>
                    <div class="swiper-slide"><img src="${ctxPath}/static/weixin-img/banner02.jpg" alt="加载中..."></div>
                    <div class="swiper-slide"><img src="${ctxPath}/static/weixin-img/banner03.jpg" alt="加载中..."></div>
                </div>
            </div>
        </div>
        <div class="homeTitle">
            <h3>
                <img src="${ctxPath}/static/weixin-img/titleBar.png" alt="加载中...">
                <span>我常用的</span>
            </h3>
        </div>
        <div class="homeNav">
            <div>
                <div onclick="schedule()"><img src="${ctxPath}/static/weixin-img/schedule.png" alt="加载中..."></div>
                <div onclick="followUp()"><img src="${ctxPath}/static/weixin-img/followUp.png" alt="加载中..."></div>
            </div>
            <div>
                <div onclick="patient()"><img src="${ctxPath}/static/weixin-img/patient.png" alt="加载中..."></div>
                <div onclick="achievement()"><img src="${ctxPath}/static/weixin-img/achievement.png" alt="加载中..."></div>
            </div>
        </div>
        <div class="homeTitle">
            <h3>
                <img src="${ctxPath}/static/weixin-img/titleBar.png" alt="加载中...">
                <span>工作统计</span>
            </h3>
        </div>
        <div class="homeStatistics">
            <div>
                <div>4</div>
                <div>4</div>
                <div>4</div>
                <div>4</div>
            </div>
            <div style="font-size: 0.8em;">
                <div>预约</div>
                <div>预约</div>
                <div>预约</div>
                <div>预约</div>
            </div>
        </div>
    </div>
</div>
<script>
    var mySwiper = new Swiper('.swiper-container', {
        autoplay:{
            stopOnLastSilde:true
        }
    });

    function schedule() {  //跳转到日程
        window.location.href = "${ctxPath}/doctorLooked/doctor_schedule";
    }
    function followUp() {  //跳转到随访
        window.location.href = "${ctxPath}/doctorLooked/doctor_followUp";
    }
    function patient() {  //跳转到患者
        window.location.href = "${ctxPath}/doctorLooked/doctor_patient";
    }
    function achievement(){  //跳转到业绩
        window.location.href = "${ctxPath}/doctorLooked/doctor_achievement";
    }
</script>
@}
